{{define "permissions.add"}}
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>权限添加</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="/statics/third-pkg/layui/css/layui.css">
  <link rel="stylesheet" href="/statics/admin/css/public.css" media="all">
  <link rel="stylesheet" href="/statics/third-pkg/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
  <style>
    body {
      background-color: #ffffff;
    }
    .layui-iconpicker-body.layui-iconpicker-body-page .hide {display: none;}
  </style>
</head>

<body>
<div class="layui-form layuimini-form" style="margin-top: 20px;">
  <div class="layui-form-item">
    <label class="layui-form-label required">上级权限</label>
    <div class="layui-input-block">
      <div id="parent_permission" class="xm-select"></div>
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label required">权限名称</label>
    <div class="layui-input-block">
      <input type="text" name="display_name" lay-verify="required" lay-reqtext="权限名称不能为空" placeholder="请输入权限名称" value="" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label required">权限标识</label>
    <div class="layui-input-block">
      <input type="text" name="code"   placeholder="请输入权限标识" value="" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label  class="layui-form-label">图标</label>
    <div class="layui-input-block">
      <input type="text" id="iconPicker" name="icon" lay-filter="iconPicker" class="hide">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">菜单url</label>
    <div class="layui-input-block">
      <input type="text" name="menu_url"   placeholder="请输入菜单url" value="" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">访问方法</label>
    <div class="layui-input-block">
      <select name="action">
        <option value="read"   selected >读</option>
        <option value="write">写</option>
      </select>
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">排序</label>
    <div class="layui-input-block">
      <input type="number" name="sort"   value="" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label required">是否是菜单</label>
    <div class="layui-input-block">
      <input type="radio" name="is_menu" value="1" title="否" checked="">
      <input type="radio" name="is_menu" value="2" title="是">
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认保存</button>
    </div>
  </div>
</div>
<!--</div>-->
<script src="/statics/third-pkg/layui/layui.js"></script>
<script src="/statics/admin/js/lay-config.js?v=2.0" charset="utf-8"></script>

<script>

  layui.use(['form','request','layer',"miniTab",'common',"iconPickerFa","xmSelect"], function() {
    var form = layui.form,
            layer = layui.layer,
            miniTab = layui.miniTab,
            common=layui.common,
            iconPickerFa=layui.iconPickerFa,
            xmSelect=layui.xmSelect,
            request=layui.request;
    var demo1 = xmSelect.render({
      el: '#parent_permission',
      radio: true,
      name: 'parent_id',
      layVerify: 'required',
      layVerType: 'msg',
      filterable: true,
      model: { label: { type: 'text' } },
      clickClose: true,
      tree: {
        show: true,
        strict: false,
      },
      height: 'auto',
      theme: {
        color: '#0081ff',
      },
      data: [
      ],
    })

    request.get('admin/permissions/list-tree').then(function (response) {
      if (response.data.code == 0) {
        var lists=response.data.data.lists;
        var data=[
          {name:"顶级菜单",'value':0},
        ]
        for (let listsKey in lists) {
          data.push(lists[listsKey])
        }
        demo1.update({
          data: data,
          autoRow: true,
        })
      } else {
        layer.msg(response.data.msg);
      }
    }).catch(function (error) {
      console.log(error)
      layer.msg('获取上级失败');
    })
    iconPickerFa.render({
      // 选择器，推荐使用input
      elem: '#iconPicker',
      // fa 图标接口
      url: "/statics/third-pkg/font-awesome-4.7.0/less/variables.less",
      // 是否开启搜索：true/false，默认true
      search: true,
      // 是否开启分页：true/false，默认true
      page: true,
      // 每页显示数量，默认12
      limit: 12,
      // 点击回调
      click: function (data) {
        console.log(data);
      },
      // 渲染成功后的回调
      success: function (d) {
        console.log(d);
      }
    });
    //监听提交
    form.on('submit(saveBtn)', function(data) {
      var subData={
        ...data.field,
        "sort":Number.parseInt(data.field['sort']),
        "is_menu":Number.parseInt(data.field['is_menu'])
      }
      request.post('admin/permissions/add',subData).then(function (response) {
        if(response.data.code==0){
          layer.msg('添加权限成功',{
            time:1000
          },function (){
            localStorage.setItem("permissions-add",common.generateUUID())
            miniTab.deleteCurrentByIframe();
            var index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);

            window.location.href="/admin/permissions/list";
          })
        }else{
          layer.msg(response.data.msg);
        }
      }).catch(function (error) {
        console.log(error)
        layer.msg('提交失败');
      });

    });

  });
</script>
</body>

</html>
{{ end }}